/*
 * @Author: wangtao
 * @Date: 2021-06-16 10:24:17
 * @LastEditors: 汪滔
 * @LastEditTime: 2021-07-21 18:03:16
 * @Description: file content
 */
/**
 * @Author: kanglang
 * @Date: 2021-02-09 14:00:21
 * @LastEditors: jipeng.li
 * @LastEditTime: 2021-05-18 17:38:21
 * @Description: 油卡入口列表
 */
import React, { Component } from 'react';
import {
  SafeAreaView,
  StyleSheet,
  View,
} from 'react-native';
import {
  fontColorBlack,
  mainBgColorLightGray,
  px2dp
} from '@/styles';
import { empty02, leftBack } from '@/images';
import { msg, XMEmpty, XMListView } from '@/common';
import RechargeHeader from '../../components/RechargeHeader';
import FictitiousOilCard from './components/fictitious-oil-card';
import EntityOilCard from './components/entity-oil-card';

export default class OilCardPlatform extends Component {
  constructor(props) {
    super(props);
    this.state = {

    };
  }

  componentDidMount() {

  }

  componentWillUnmount() {
  }

  render() {
    return (
      <SafeAreaView style={{ flex: 1 }}>
        <RechargeHeader
          leftTitle='缘多用油'
          style={{ paddingLeft: px2dp(0) }}
          leftBackStyle={{ backgroundColor: 'rgba(0, 0, 0, 0.1)' }}
          leftBackIcon={leftBack}
        />
        <XMListView
          url='energy-api/api/v1/Verification/agreement/getAgreementOilCard'
          methods='GET'
          dataPropsName='data.records'
          renderRow={(item, index) => this._renderItem(item, index)}
          renderEmpty={() => <XMEmpty emptyImg={empty02} desc='您暂时没有油卡哦~' boxStyle={{ marginTop: px2dp(200) }} />}
        />
      </SafeAreaView>
    );
  }

  _renderItem = (item) => {
    let cardData = {
      owner: item.carownerName,
      companyType: item.legalCustName,
      companyName: item.allianceName, // 公司名字
      isHangAccount: true // 挂账卡
    };
    return (
      <View style={{ alignItems: 'center', marginBottom: px2dp(60) }}>
        <FictitiousOilCard
          cardClick={() => {
            msg.emit('router: goToNext', {
              routeName: 'OliCardDetails',
              cardData: item,
              oilCardType: 2,
            });
          }}
          {...cardData}
        />
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: mainBgColorLightGray,
    paddingVertical: px2dp(40),
  },
  tabActive: {
    color: fontColorBlack,
    fontSize: px2dp(30),
  }
});
